<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <link rel="shortcut icon" href="../../src/images/bitbug_favicon.ico" type="image/x-icon">
  <meta name="keywords" content="your keywords">
  <meta name="description" content="your description">
  <meta name="author" content="author,email address">
  <meta name="robots" content="index,follow">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <title>仁和区党群服务一号通暨群众意见受理中心</title>
  <link rel="stylesheet" href="../../src/css/base.css">
  <link rel="stylesheet" href="../../src/css/common.css">
  <link rel="stylesheet" href="../../src/css/tpl.css">
  <link rel="stylesheet" href="../../src/css/user_center.css">
  <link rel="stylesheet" href="../../src/css/Goldidea.css">
    <script src="../../src/js/libs/es5-shim.min.js"></script>   <script src="../../src/js/libs/es5-sham.min.js"></script>    <script src="../../src/js/libs/json3.min.js"></script> </head>

<body>

  <div class="page">
    <div id="header"></div>
    <div class="menu-bar">
      <div class="container">
        <span>
        <span class="crumb-name">当前你的位置：</span>>
        </span>
        <span>
             <a href="../Home/Index.html">首页</a>>
      </span>
        <span>
        <a class="" href="">在线民声</a>>
      </span>
        <span>
        <a class="" href="">金点子</a>
      </span>
      </div>
    </div>

    <div class="mid_container clearfix">
      <div class="left_guide">
        <h1 class="left_guide_top_size">
          在线民声
        </h1>
        <div class="left_guide_decorate">
        </div>
        <div class="left_about_us">
          THE VOICE OF THE PEOPLE
        </div>
        <div class="left_white_about active">
          <a href="Goldidea.html" class="left_white_bottom"><span class="left_cn_about_us">金点子</span></a>
        </div>
        <div class="left_white_about">
          <a href="Feedback.html" class="left_white_bottom"><span class="left_cn_about_us">建议意见</span></a>
        </div>
        <div class="left_white_about">
          <a href="Notice.html" class="left_white_bottom"><span class="left_cn_about_us">民生投诉</span></a>
        </div>
        <div class="left_white_about">
          <a href="SJMailbox.html" class="left_white_bottom"><span class="left_cn_about_us">书记信箱</span></a>
        </div>
        <div class="left_white_about">
          <a href="QZMailbox.html" class="left_white_bottom"><span class="left_cn_about_us">区长信箱</span></a>
        </div>
        <div class="left_white_about">
          <a href="Demanfar.html" class="left_white_bottom "><span class="left_cn_about_us">来件查询</span></a>
        </div>
      </div>
      <div class="mid_guide">
        <div class="mid_guide_content mid_guide_content_details">
          <div class="content" id="content_html">
          </div>
        </div>
        <div class="mid_guide_content">
          <div class="content" id="comment_html">

          </div>
          <div id="page1" class="laypage"></div>
        </div>
      </div>
    </div>
  </div>

  </div>
  <div id="footer">
  </div>
  <script id="content_tpl" type="text/html">
    <h3 class="details_title">{{title}}</h3>
    <div class="details_time">
      <span>时间：</span><span>{{createtime}}</span>
    </div>
    <div class="details_page" id="content_info">
    </div>
    <!-- <div class="file_list">
      <div class="file_list_file">
        <img src="../../src/images/gdz-3.png">
        <span class="file_list_file_span_one">文件</span>
        <br/>
        <span class="file_list_file_span_two">13.3KB</span>
      </div>
    </div> -->
  </script>
  <script id="comment_tpl" type="text/html">
    <div class="details_comment_title">
      <img src="../../src/images/gdz-4.png">
      <span class="comment_title">评论( {{count}}条)</span>
    </div>
    <div class="details_comment_box">
      <textarea type="text" name="comment_content"></textarea>
      <button class="details_comment_button js_add_comment">评论</button>
    </div>
    {{each data val idx}}
    <div class="details_comment_page">
      <p class="details_comment_page_p_one">{{val.content}}</p>
      <p class="details_comment_page_p_two">
        发布于：{{val.createtime}}
      </p>
    </div>
    {{/each}}
  </script>
  <script src="../../src/js/libs/jquery.1.12.4.js"></script>
  <script src="../../src/js/libs/template-web.js"></script>
  <script src="../../src/js/libs/laypage/laypage.js"></script>
  <script src="../../src/js/libs/layer/layer.js"></script>
  <script src="../../src/js/base/common.js"></script>
  <script>
    var params = {
      id: window.location.href.split('?')[1].split('=')[1],
      userid: null,
      page: 1
    }
    var pageindex = 4

    if (document.cookie) {
      params.userid = document.cookie.split(";")[1].split("=")[1]
    }

    // 发表评论
    $(document).on('click', '.js_add_comment', function () {
      var val = $('textarea[name="comment_content"]').val().trim()
      if (val.length === 0) {
        return layer.msg('评论不能为空')
      }
      $.ajax({
        url: 'http://221.10.2.222:5680/api/w1/GoldenIdeaComment/add',
        type: "POST",
        dataType: "json",
        data: {
          id: params.id,
          content: val,
          createUserId: params.userid
        },
        success: function (res) {
          console.log(res)
          getComment(params, 1)
        }
      })
    })

    // 获取详情
    $.ajax({
      url: 'http://221.10.2.222:5680/api/w1/GoldenIdea/getDetail/' + params.id,
      type: "GET",
      dataType: "json",
      success: function (res) {
        console.log(res)
        var content = template('content_tpl', res)
        $('#content_html').html(content)
        $('#content_info').html(res.content)
      }
    })

    // 获取评论
    function getComment(params, page) {
      $.ajax({
        url: 'http://221.10.2.222:5680/api/w1/GoldenIdeaComment/list/',
        type: "POST",
        dataType: "json",
        data: {
          id: params.id,
          pageIndex: page
        },
        success: function (res) {
          console.log(res)
          var comment = template('comment_tpl', res)
          $('#comment_html').html(comment)
          laypage({
            cont: 'page1',
            pages: Math.ceil(res.count / 6),
            curr: page || 1,
            first: false,
            last: false,
            prev: '<',
            next: '>',
            jump: function (obj, first) {
              if (!first) {
                getComment(params, obj.curr);
              }
            }
          });
        }
      })
    }

    getComment(params, 1)
  </script>
</body>

</html>